{include file="public/header" /}
<style>
	.layui-upload-file{
		display: none;
	}
</style>
<script src="__JS__/lCalendar.min.js"></script>
<link rel="stylesheet" type="text/css" href="__CSS__/lCalendar.css">
<body class="zc_body">

	
	<!--header start-->
    <header>
    	<div class="header">
        	<a href="#" class="fan"></a>
        	<h1>注册</h1>
        </div>
    </header>
    <!--header end-->
    
    <!--main start-->
    <div class="zc_one">用 户 注 册</div>
    <ul class="zc_two">
    	<li class="li">
        	<img id="img_show" src="{$info.head_img}" class="img_tx">
			<input type="hidden" id="head_img" value="{$info.head_img}">
			<input type="hidden" id="uid" value="{$uid}">
        	<input id="btn_tx" type="button" class="btn_tx" value="上传头像">
        </li>
    	<li><input id="nickname" value="{$info.nickname}" type="text" class="txt" placeholder="网名"></li>
    	<li><input id="wx_code" type="text" class="txt" placeholder="微信号"></li>
    	<li><input id="mobile" type="text" class="txt" placeholder="手机号"></li>
    	<li><input id="birth" value="1990-01-01" type="text" class="txt" placeholder="出生日期" data-lcalendar="1980-01-01,2002-12-31"></li>
    	<li class="li">
        	<select id="home_province" class="s1">
				<option value="">选择省份</option>
				{volist name="areaList" id="vo"}
				<option value="{$vo.id}" >{$vo.name}</option>
				{/volist}
            </select>
        	<select id="home_city" class="s2">
            	<option>选择城市</option>
				{volist name="cityList" id="vo"}
				<option value="{$vo.id}" >{$vo.name}</option>
				{/volist}
            </select>
        </li>
    	<li><input id="address" type="text" class="txt" placeholder="具体地址"></li>
    	<li class="li">
        	<select id="offer_id">
				{volist name="offer_list" id="vo"}
				<option value="{$vo.id}" >{$vo.name}</option>
				{/volist}
            </select>
        </li>
    	<li><input id="college" type="text" class="txt" placeholder="毕业院校"></li>
    	<li><input id="work" type="text" class="txt" placeholder="工作单位"></li>
    	<li><input id="height" type="number" class="txt" placeholder="身高"></li>
        <li class="ll">择偶标准</li>
    	<li class="li">
        	<select id="other_age">
            	<option value="0">请选择年龄范围</option>
            	<option value="20-25">20-25</option>
            	<option value="25-30">25-30</option>
            	<option value="30-35">30-35</option>
            </select>
        </li>
    	<li class="li">
        	<select id="other_offer_id">
				{volist name="offer_list" id="vo"}
				<option value="{$vo.id}" >{$vo.name}以上</option>
				{/volist}
            </select>
        </li>
		<li class="li">
			<select id="other_height">
				<option value="0">请选择身高范围</option>
				<option value="150-160">150-160</option>
				<option value="160-170">160-170</option>
				<option value="170-180">170-180</option>
				<option value="180">180以上</option>
			</select>
		</li>
        <li class="li">
        	<input type="button" class="btn_zc" value="立即注册">
        </li>
    </ul>
    <!--main end-->
    
</body>
<script src="/static/layui/layui.js"></script>
<script>
	var calendar = new lCalendar();
	calendar.init({
		'trigger': '#birth',
		'type': 'date'
	});
	$('#home_province').change(function () {
		var province_id = $('#home_province').val();
		$.get('{:url("index/User/member_area")}?id='+province_id, function (res) {
			if(res){
				var html = '';
				for (var i=0 ;i<res.length;i++){
					html += "<option value="+res[i]['id']+">"+res[i]['name']+"</option>";
				}
				$('#home_city').html(html);
			}
		});
	})
	$('.btn_zc').click(function () {
		var uid = {$uid};
		var head_img = $('#head_img').val();
		if(!head_img){
			layer.msg('头像不能为空');
			return false;
		}
		var birth = $('#birth').val();
		if(!birth){
			layer.msg('出生日期不能为空');
			return false;
		}
		var nickname = $('#nickname').val();
		if(!nickname){
			layer.msg('昵称不能为空');
			return false;
		}
		var mobile = $('#mobile').val();
		var wx_code = $('#wx_code').val();
		if(!wx_code){
			layer.msg('微信号不能为空');
			return false;
		}
		var home_province = $('#home_province').val();
		if(!home_province){
			layer.msg('省份不能为空');
			return false;
		}
		var home_city = $('#home_city').val();
		if(!home_city){
			layer.msg('城市不能为空');
			return false;
		}
		var offer_id = $('#offer_id').val();
		if(!offer_id){
			layer.msg('学历不能为空');
			return false;
		}
		var college = $('#college').val();
		if(!college){
			layer.msg('毕业院校不能为空');
			return false;
		}
		var work = $('#work').val();
		if(!work){
			layer.msg('工作单位不能为空');
			return false;
		}
		var height = $('#height').val();
		if(!height){
			layer.msg('身高不能为空');
			return false;
		}
		var other_age = $('#other_age').val();
		if(!other_age){
			layer.msg('择偶年龄不能为空');
			return false;
		}
		var other_offer_id = $('#other_offer_id').val();
		if(!other_offer_id){
			layer.msg('择偶学历不能为空');
			return false;
		}
		var other_height = $('#other_height').val();
		if(!other_height){
			layer.msg('择偶身高不能为空');
			return false;
		}
		$.post("{:url('index/User/reg')}", {'id':uid,'wx_code':wx_code,'mobile':mobile,'birth':birth,'home_province':home_province,'home_city':home_city,'offer_id':offer_id,'college':college,'work':work,'height':height,'other_age':other_age,'other_offer_id':other_offer_id,'other_height':other_height}, function (res) {
			if (res.code == 1) {
				layer.msg(res.msg, {time: 2000, icon: 1});
				sleep(2);
				location.href = "{:url('index/Index/index')}";
			} else {
				layer.msg(res.msg, {time: 2000, icon: 2});
				sleep(2);
			}
		});
	})
</script>
<script>
	layui.use(['upload'], function () {
		var $ = layui.jquery,
				upload = layui.upload;

		//拖拽上传
		upload.render({
			elem: '#btn_tx'
			, url: '{:url("Upload/uploadface")}'
			, data: {
				savepath: 'home_task'
			}
			, auto: true
			, size: 1024 * 2  //限制文件大小，单位 KB
			, accept: 'images'
			, choose: function (obj) {
				$('#thumb_image_but').show();
				obj.preview(function (index, file, result) {
					$('#head_img').attr('src', result);  //图片链接（base64）
				});
			}
			, done: function (res) {
				//上传成功
				if (res.code == 1) {
					$('#head_img').val(res.data);
					$('#img_show').attr('src',  '/uploads/face/' + res.data);
					return layer.msg(res.msg, {time: 1000, icon: 1});
				} else {
					//如果上传失败
					return layer.msg(res.msg, {time: 1000, icon: 2});
				}
			}
			, error: function () {
				//演示失败状态，并实现重传
			}
		});
	});
</script>
</html>
